import {useContext} from 'react'
import { Context, ContextProvider } from './ContextProvider'
import { Context2, ContextProvider2 } from './ContextProvider2'


function MyComponent() {
  let {count, add, reduce} = useContext(Context)
  return (
    <div>
      <h2>{count}</h2>
      <button onClick={() => {add()}}>add</button>
      <button onClick={() => {reduce()}}>reduce</button>
    </div>
  )
}

let r = () => {
  return (
    <ContextProvider>
        <MyComponent/>
    </ContextProvider>
  )
}

export default r